<template>

   <div class="Swrap">
     <div class="Swrap-top">
       <div class="top-wrap">
         <div class="top-wrap-left">
           <div class="nameandtel">
             <div class="Sname">
               {{addressname}}
             </div>
             <div class="Stel">
               {{addressTel}}
             </div>
           </div>
           <div class="Saddress">
             {{address}}
           </div>
         </div>
         <img class="jd" src="../../../static/images/youjiantou.png" alt="" @tap="chooseaddress"/>
       </div>
     </div>
     <div class="Swrap-nav">
       <div class="nav-choose">
         配送时间
         <img class="jd" src="../../../static/images/youjiantou.png" alt="" />
       </div>
     </div>
     <div class="Swrap-nav">
        <div class="nav-choose">
          优惠劵
          <img class="jd" src="../../../static/images/youjiantou.png" alt="" />
        </div>
      </div>
     <div class="Swrap-center">
       <div class="Scenter">
         <div class="nowmerchant">
           ———— {{nowmerchant}}————
         </div>
         <div class="Sgood-wrap" v-for="(item,index) of goodlist" :key="index">
           <img  class="Sgood-i" :src="item.goodsimg" alt="" />
           <div class="Sgood-right">
             <div class="goodsname">{{item.goodsname}}</div>
             <div class="goodspriceandcishu">
               <div class="Sprice">￥{{item.price}}x</div><div class="Scishu">{{item.cishu}}</div>
             </div>

           </div>
           <div class="Sgood-last">
             <div class="money">
               ￥{{item.price*item.cishu}}
             </div>

           </div>
         </div>
         <div class="Sgoodsallmoney">
           <span>商品金额</span><span>￥1</span>
         </div>
         <div class="Sgoodsallmoney">
           <span>配送费</span><span>无</span>
         </div>
         <div class="Sgoodsdiscount">
           <span>红包</span><span class="wu">暂无红包</span>
         </div>
         <div class="Sgoodsdiscount">
           <span>优惠</span><span class="wu">暂无优惠</span>
         </div>
         <div class="truemoney">
           <div class="truemoney-box">
              实付金额<span class="truepay">￥{{price}}</span>
           </div>
         </div>
       </div>
     </div>
     <div class="Swrap-nav">
       <div class="nav-choose">
         优惠劵
         <img class="jd" src="../../../static/images/youjiantou.png" alt="" />
       </div>
     </div>
     <div class="Swrap-nav">
       <div class="nav-choose">
         号码保护
         <img class="jd" src="../../../static/images/youjiantou.png" alt="" />
       </div>
     </div>
     <div class="Swrap-nav">
       <div class="nav-choose">
         备注
         <img class="jd" src="../../../static/images/youjiantou.png" alt="" />
       </div>
     </div>
     <div class="bottom-nav">
       <div class="go-box">
         <span class="rmb">￥</span><span class="allrmb">{{price}}</span>
       </div>
       <div :class="['Settlement','goshoping']" >
         提交订单
       </div>
     </div>

   </div>
</template>

<script>
  import Self from '@/self'
export default {
  data() {
    return {
         nowmerchant:'',
         goodlist:'',
         price:'',
         jiage:0,
         addressname:'',
         address:'',
         addressTel:'',
      }
    },
  //page B
  methods:{
    count(a,b){
      this.jiage= Number(a)* Number(b);
      return this.jiage;
    },
    chooseaddress(){
      wx.navigateTo({
        url:'/pages/chooseadress/main'
      })
    },
  },
  computed:{

  },
  onLoad(options){

    this.nowmerchant=this.global.nowmerchant;
    this.goodlist=this.global.Allgoodlist;
    this.price=this.global.allprice;
    let that=this;
    if(this.global.chooseaddress===''){
      wx.request({
        url: 'http://192.168.1.20:8099/WebHandler/GuoUserHandler.ashx',
        method: 'post',
        data: {
          type: 'findUserAddress',
          userId:this.global.myID,
        },
        header: {
          'content-type': 'application/x-www-form-urlencoded' // 默认值
        },
        success: function (res) {
          if(res.data.msg==="该地址不存在"){
            that.addressname='新建收货地址';

          }else {
            that.addressname=res.data.address[0].Receiver;
            that.addressTel=res.data.address[0].Telephone;
            that.address=res.data.address[0].Address;
          }
        }
      })
    }

    // console.log(this.goodlist)
  },
  onShow(){
    this.nowmerchant=this.global.nowmerchant;
    this.goodlist=this.global.Allgoodlist;
    this.price=this.global.allprice;
    this.addressname=this.global.addressname;
    this.addressTel=this.global.addresstel;
    this.address=this.global.chooseaddress;
  }


}
</script>

<style>
  body{
    height:100%;
    width:100%;
    background-color: #f1f1f1;
  }
  .Swrap{


    height: 100%;
    width:100%;
    overflow: auto;
    font-size:28rpx;
  }
  .Swrap-top{
    margin-top:20rpx;
    height: 185rpx;
    background-color: #ffffff;
  }
  .Swrap-center{
    width:100%;
    background-color:#fa541c;
  }
  .bottom-nav{
    width:100%;
    height: 8%;
    position: absolute;
    bottom:0;
    background-color: #ccc;
    display: flex;
    z-index: 300;

  }
  .go-box{
    height: 100%;
    width:70%;
    position: relative;
    color:#ccc;
    background-color: #ffffff;
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }
  .Settlement{
    height: 100%;
    width:30%;
    color:#fff;
    display:flex;
    justify-content:center;
    align-items:center;

  }
  .rmb{
    color:red;
    font-size:25rpx;
    margin-left: 2.5%;
  }
  .allrmb{
    color:red;
  }
  .goshoping{
    background-color: #49B152;
  }
  .top-wrap{
    height: 100%;
    width: 95%;
    margin:0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;

  }
  .jd{
    height: 40rpx;
    width:40rpx;
  }
  .top-wrap-left{
    height: 100%;
    width:70%;
    border:1px soldi aqua;
    font-size: 28rpx;
    font-weight: 700;
  }
  .nameandtel{
    height: 50%;
    width:100%;

    display: flex;
    justify-content: flex-start;
    align-items: center;
  }
  .Saddress{
    height:50%;
    width:100%;

    display: flex;
    align-items: center;
  }
  .Sname{
    height: 100%;
    display: flex;
    align-items: center;
  }
  .Stel{
    height: 100%;
    margin-left:40rpx;
    display: flex;
    align-items: center;
  }
  .nav-choose{
    width:95%;
    margin:0 auto;
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .Swrap-nav{
    background-color: #ffffff;
    height: 100rpx;
    width: 100%;
    margin-top:20rpx;
  }
  .Swrap-center{
    width:100%;
    background-color: #ffffff;
    margin-top:20rpx;
  }
  .Scenter{
    height: 100%;
    width:95%;
    margin:0 auto;

  }
  .nowmerchant{
    height: 100rpx;
    width:100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .Sgood-wrap{
    height: 150rpx;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .Sgood-i{
    height:120rpx;
    width:120rpx;

  }
  .Sgood-right{
    height: 70%;
    width:70%;

  }
  .Sgood-last{
    height: 70%;
    width:14%;

    position: relative;
  }
  .goodsname{
    height: 50%;
    width:100%;
  }
  .goodspriceandcishu{
    height: 50%;
    width:100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }
  .Sprice{
    height: 100%;
  }
  .Scishu{
    height: 100%;
  }
  .money{
    position: absolute;
    bottom:0;
    right: 0;
  }
  .Sgoodsallmoney{
    height: 90rpx;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width:100%;
  }
  .Sgoodsdiscount{
    height: 100rpx;
    width:100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top:1px solid #cccccc;
  }
  .wu{
    color: #cccccc;
  }
  .truemoney{
    height: 120rpx;
    width:100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    border-top:1px solid #cccccc;

  }
  .truemoney-box{
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .truepay{
    font-weight: bolder;
    font-size:32rpx;
  }







</style>
